
<!--<!DOCTYPE html>-->
<!--<html lang="en">-->
<!--<head>-->
<!--    <meta charset="UTF-8">-->
<!--    <meta name="viewport" content="width=device-width, initial-scale=1.0">-->
<!--    <title>Hello 页面</title>-->
<!--    <style>-->
<!--        body {-->
<!--            font-family: Arial, sans-serif;-->
<!--            text-align: center;-->
<!--            margin-top: 20%;-->
<!--        }-->
<!--        .hello-text {-->
<!--            font-size: 36px;-->
<!--            color: #333;-->
<!--        }-->
<!--    </style>-->
<!--</head>-->
<!--<body>-->
<!--<div class="hello-text">Hello</div>-->
<!--</body>-->
<!--</html>-->






<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
    <title>jssdkTest</title>
    <script type="text/javascript" src="jssdk.js"></script>
    <style>
        span {
            display:inline-block;
            word-break:break-word;
        }
    </style>
    <script>

        window.onload = function() {
            JSSDK.getJsInfo((param)=>{
                document.getElementById("flutter_call_info").innerHTML = "接收flutter端传递的参数:<br>" + JSON.stringify(param);
                return {'returnNumber': Math.floor(Math.random() * 2000)};
            })
        };

        //获取用户信息
        function getUserInfoCallback() {
            JSSDK.getUserInfo({
                success: function (res) {
                    document.getElementById("user_info_callback").innerHTML = "用户信息(回调):" + JSON.stringify(res);
                }
            });
        }

        //获取用户信息(Promise)
        function getUserInfo() {
            JSSDK.getUserInfo({}).then(function (res) {
                document.getElementById("user_info").innerHTML = "用户信息(Promise) :" + JSON.stringify(res);
            });
        }

        //跳转登录
        function login() {
            JSSDK.login({});
        }

        //监听网络变化
        function onNetworkStatusChange() {
            JSSDK.onNetworkStatusChange((res) => {
                document.getElementById("network_status").innerHTML = "网络状态 : " + JSON.stringify(res);
            });
        }

        //模拟上传文件
        function onUploadFile() {
            var uploadTask = JSSDK.uploadFile({
               url: 'https://www.example.com/upload',
               filePath: '/path/to/file'
            });

            uploadTask.onProgressUpdate((res) => {
                console.log('上传进度' + res.progress);
                console.log('已经上传的数据长度' + res.totalBytesSent);
                console.log('预期需要上传的数据总长度' + res.totalBytesExpectedToSend);
                document.getElementById("upload_file").innerHTML = "文件状态 : " + JSON.stringify(res);

                // 测试条件，取消上传任务。
                if (res.progress > 50) {
                    uploadTask.abort();
                }
            });
        }


    </script>
</head>

<body>
<div style="display:flex; flex-direction: column">
    <br>
    <span id="flutter_call_info">接收flutter端传递的参数 : </span><br><br>

    <br>
    <button style="margin-top: 20px" onclick="getUserInfoCallback()">获取用户信息(回调)</button>
    <span id="user_info_callback">用户信息(回调) : </span><br><br>

    <br>
    <button style="margin-top: 20px" onclick="getUserInfo()">获取用户信息(promise)</button>
    <span id="user_info">用户信息(Promise) : </span><br><br>

<!--    <br>-->
<!--    <button style="margin-top: 20px" onclick="login()">跳转登录页面</button>-->
<!--    <br>-->
<!--    <button style="margin-top: 20px" onclick="onNetworkStatusChange()">监听网络变化</button>-->
<!--    <span id="network_status">监听网络状态: </span><br><br>-->

<!--    <br>-->
<!--    <button style="margin-top: 20px" onclick="onUploadFile()">模拟上传文件</button>-->
<!--    <span id="upload_file">上传文件状态: </span><br><br>-->
<!--    <br>-->
</div>
</body>

</html>





















<!--<!doctype html>-->
<!--<html>-->

<!--<head>-->
<!--    <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1.0, maximum-scale=1.0">-->
<!--    <style type='text/css'>-->
<!--		html {-->
<!--			font-family: Helvetica;-->
<!--			color: #222;-->
<!--		}-->

<!--		h1 {-->
<!--			color: steelblue;-->
<!--			font-size: 24px;-->
<!--			margin-top: 24px;-->
<!--		}-->

<!--		button {-->
<!--			margin: 0 3px 10px;-->
<!--			font-size: 12px;-->
<!--		}-->

<!--		.logLine {-->
<!--			border-bottom: 1px solid #ccc;-->
<!--			padding: 4px 2px;-->
<!--			font-family: courier;-->
<!--			font-size: 11px;-->
<!--		}-->
<!--	</style>-->
<!--</head>-->

<!--<body>-->
<!--<h1>WebViewJavascriptBridge Demo</h1>-->
<!--<script>-->
<!--		window.onerror = function (err) {-->
<!--			log('window.onerror: ' + err)-->
<!--		}-->

<!--		function setupWebViewJavascriptBridge(callback) {-->
<!--			if (window.WebViewJavascriptBridge) { return callback(WebViewJavascriptBridge); }-->
<!--			if (window.WVJBCallbacks) { return window.WVJBCallbacks.push(callback); }-->
<!--			window.WVJBCallbacks = [callback];-->
<!--			var WVJBIframe = document.createElement('iframe');-->
<!--			WVJBIframe.style.display = 'none';-->
<!--			WVJBIframe.src = 'https://__bridge_loaded__';-->
<!--			document.documentElement.appendChild(WVJBIframe);-->
<!--			setTimeout(function () { document.documentElement.removeChild(WVJBIframe) }, 0)-->
<!--		}-->

<!--		setupWebViewJavascriptBridge(function (bridge) {-->
<!--			var uniqueId = 1-->
<!--			function log(message, data) {-->
<!--				var log = document.getElementById('log')-->
<!--				var el = document.createElement('div')-->
<!--				el.className = 'logLine'-->
<!--				el.innerHTML = uniqueId++ + '. ' + message + ':<br/>' + JSON.stringify(data)-->
<!--				if (log.children.length) { log.insertBefore(el, log.children[0]) }-->
<!--				else { log.appendChild(el) }-->
<!--			}-->

<!--			bridge.registerHandler('testJavascriptHandler', function (data, responseCallback) {-->
<!--				log('Flutter called testJavascriptHandler with', data)-->
<!--				var responseData = { 'Javascript Says': 'Right back atcha!' }-->
<!--				log('JS responding with', responseData)-->
<!--				responseCallback(responseData)-->
<!--			})-->

<!--			document.body.appendChild(document.createElement('br'))-->

<!--			var callbackButton = document.getElementById('buttons').appendChild(document.createElement('button'))-->
<!--			callbackButton.innerHTML = 'Fire testFlutterCallback'-->
<!--			callbackButton.onclick = function (e) {-->
<!--				e.preventDefault()-->
<!--				log('JS calling handler "testFlutterCallback"')-->
<!--				bridge.callHandler('testFlutterCallback', { 'foo': 'bar' }, function (response) {-->
<!--					log('JS got response', response)-->
<!--				})-->
<!--			}-->
<!--		})-->
<!--	</script>-->
<!--<div id='buttons'></div>-->
<!--<div id='log'></div>-->
<!--</body>-->

<!--</html>-->